<%--
  Created by IntelliJ IDEA.
  User: 86155
  Date: 2021/11/3
  Time: 0:29
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<%@ include file="../common/IncludeTop.jsp"%>
<style>
    .okTips{
        color: green;
    }
    .errorTips{
        color:red;
    }
</style>
<script>
    // var xhr;
    // function checkUsername()
    // {
    //     var username=document.getElementById("username").value;
    //     // alert(username);//alert() 方法用于显示带有一条指定消息和一个 OK 按钮的警告框
    //     xhr=new XMLHttpRequest();
    //     xhr.onreadystatechange=fun1;
    //     xhr.open("GET","usernameExit?username="+username,true);
    //     xhr.send(null);
    //
    // }
    // function fun1()
    // {
    //     console.log("abc")
    //     if(xhr.readyState===4)
    //     {
    //         if(xhr.status===200)
    //         {
    //             var tips=document.getElementById("usernameTips")
    //             var respnseInfo =xhr.responseText;
    //             // console.log(respnseInfo);
    //             if(respnseInfo==="Exist")
    //             {
    //                 tips.className="errorTips";
    //                 tips.innerText="Invalid";
    //             }
    //             else if(respnseInfo==="Not Exist")
    //             {
    //                 tips.className="okTips";
    //                 tips.innerText="Available";
    //             }
    //         }
    //     }
    // }Available
    $(function (){
        $('#username').on('blur',function (){
            //console.log(this.value);
            $.ajax({

                type   :  "GET",
                url    :   "UpdateUsername?username="+this.value,
                success:  function (data){
                    if(data.msg==='Exist')
                    {
                        $('#usernameTips').attr("class","errorTips").text('Invalid');

                    }
                    else if(data.msg==='Not Exist')
                    {
                        $('#usernameTips').attr("class","okTips").text('Valid');
                    }
                }
            })
        })
    })

</script>
<form action="insertAccount" method="post">
    <div id="Catalog">

        <h3>User Information</h3>

        <table>
            <tr>
                <td>
                    User ID:<input type="text" id="username" name="username" >
                    <span id="usernameTips"></span>
                </td>

            </tr>
            <tr>
                <td>New password:<input type="password" name="password"></td>

            </tr>
            <tr>
                <td>Repeat password:<input type="password" name="repassword"></td>

            </tr>
        </table>

        <%@ include file="IncludeAccountFields.jsp"%>

        <input type="submit"  name="newAccount" value="Save Account Information" />
        <p>${sessionScope.msg}</p>


    </div>
</form>

<%@ include file="../common/IncludeBottom.jsp"%></title>


